<!-- 性质组件的封装 -->
<template>
  <el-select placeholder="请选择性质" v-model="currentValue" :popper-append-to-body="false">
    <el-option v-for="(item,index) in optionList" :key="index" :label="item.name" :value="item.val">
    </el-option>
  </el-select>
  <!-- 父组件调用 -->
  <!-- <XZSelect :value="query.nature" @parentEvent="getXZChild" ref="XZDome"></XZSelect> -->
</template>
<script>
import { getNature } from '@/api/index.js';
export default {
  name: 'xz-select',
  props: {
    value: {
      type: [String, Number]
    }
  },
  // props: ['value'],
  data () {
    return {
      optionList: [],
      currentValue: this.value
    }
  },
  computed: {},
  created () {
  },
  mounted () {
    this.getOptionList()
  },
  methods: {
    /**
     * 获取性质的下拉数据
     */
    getOptionList () {
      getNature().then(res => {
        if (res.success) {
          this.optionList = res.data
        } else {
          this.$message.error(`${res.msg}`)
        }

      })
    },
    /**
    * 清空内容
    */
    clearContent () {
      this.currentValue = '';
    }
  },
  // 监听 value：使 value 能在初始化时有值，监听 data（currentValue）：使子组件修改值通知给父组件同步（重要）
  watch: {
    value (newVal) {
      this.currentValue = newVal;
    },
    currentValue (newVal, oldVal) {
      if (newVal !== oldVal) {
        // 子组件通过$$emit 给父组件派发事件
        this.$emit('parentEvent', this.currentValue)
      }
    }
  },
}
</script>
<style scoped>
</style>